<!--
 * @Descripttion: 虚拟支付
 * @Author: xiao li
 * @Date: 2020-07-06 12:17:07
 * @LastEditors: xiao li
 * @LastEditTime: 2021-04-28 15:37:12
-->
<template>
    <div class="lb-payment">
        <top-nav />
        <div class="page-main">
          <el-form @submit.native.prevent :model="ruleForm" label-width="130px">
              <el-form-item label="面议按钮" prop="cardText">
                <el-input v-model="ruleForm.btn_talk" placeholder="请输入内容"></el-input>
                <lb-tool-tips>{{tips[1]}}</lb-tool-tips>
              </el-form-item>
              <el-form-item label="IOS虚拟支付" prop="word">
                <el-radio-group v-model="ruleForm.ios_pay">
                  <el-radio :label="1">{{$t('action.ON')}}</el-radio>
                  <el-radio :label="0">{{$t('action.OFF')}}</el-radio>
                </el-radio-group>
                <lb-tool-tips>是否允许小程序IOS端显示支付相关的内容, 关闭后IOS端所有和支付相关的内容不会显示。开启此设置涉及到虚拟支付容易被封禁，请谨慎开启。</lb-tool-tips>
              </el-form-item>
              <el-form-item label="android虚拟支付" prop="cardText">
                <el-radio-group v-model="ruleForm.android_pay">
                  <el-radio :label="1">{{$t('action.ON')}}</el-radio>
                  <el-radio :label="0">{{$t('action.OFF')}}</el-radio>
                </el-radio-group>
                <lb-tool-tips>是否允许小程序android端显示支付相关的内容, 关闭后android端所有和支付相关的内容不会显示</lb-tool-tips>
              </el-form-item>
              <el-form-item>
                  <lb-button type='primary' @click="submitForm">{{$t('action.submit')}}</lb-button>
              </el-form-item>
          </el-form>
        </div>
    </div>
</template>

<script>
export default {
  data () {
    return {
      tips: {1: `${this.$t('menu.Malls')}详情页咨询面议文字`},
      ruleForm: {
        btn_talk: '',
        ios_pay: 0,
        android_pay: 0
      }
    }
  },
  created () {
    this.getSettingInfo()
  },
  methods: {
    /**
     * @method 获取设置数据回显
     */
    getSettingInfo () {
      this.$api.orderSettingInfo().then(res => {
        if (res.code === 200) {
          this.ruleForm.btn_talk = res.data.btn_talk
          this.ruleForm.ios_pay = res.data.ios_pay === 1 ? 1 : 0
          this.ruleForm.android_pay = res.data.android_pay === 1 ? 1 : 0
        }
      })
    },

    /**
     * @method 保存设置
     */
    submitForm () {
      let {ruleForm} = this
      this.$api.orderSetting(ruleForm).then(res => {
        if (res.code === 200) {
          this.$message.success(this.$t('tips.successOper'))
        }
      })
    }
  }
}
</script>

<style lang="scss" scoped>
  .lb-payment{
    width: 100%;
    .el-form{
      width: 100%;
      .el-form-item{
        margin-bottom: 5px;
        .el-input{
          width: 300px;
        }
      }
      .last-form-item{
        margin-top: 30px;
      }
      .item-tips{
        margin-left: 130px;
        margin-bottom: 24px;
        color: #999999;
      }
    }
  }
</style>
